
<template>
  <el-dialog
    :visible.sync="dialogVisible"
    :before-close="handleClose"
    :append-to-body="false"
    class="create-order-kind-dialog small-common-dialog-size"
    @close="closeDialog">
    <Title title="合同回收" font-size="16px" style="margin-bottom:20px;"/>
    <el-form
      ref="configKindForm"
      label-position="left"
      label-width="86px"
      class="setting-form">
      <el-form-item label="合同回收" prop="name" style="margin-bottom: 24px;" class="lable" label-width="70px">
        <up-attachment
          :import-api="'/common/file/upload'"
          :hide-confirm="true"
          :file-list="attachment"
          :limit="10"
          :is-review="isReview"
          btn-text="上传文件"
          @complateSetData="complateSetData($event)"
          @removeFileList="removeFileList($event)"
        />
      </el-form-item>
    </el-form>
    <div class="btn-container">
      <el-button :loading="loading" type="primary" size="small" @click="submit">确定</el-button>
      <el-button class="cancel-btn-style" size="small" style="width: 80px" @click="handleClose">取消</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { contractRecycleApi } from '@/api/legal';
import upAttachment from '@/components/Common/upAttachment/index';
import Title from '@/components/Title';
export default {
  name: 'ContractRecycleDialog',
  components: {
    upAttachment,
    Title
  },
  data() {
    return {
      dialogVisible: false,
      loading: false,
      attachment: [],
      isReview: true
    };
  },
  methods: {
    handleClose() {
      this.dialogVisible = false;
    },
    complateSetData({ data, fileName }) {
      this.createLoading = false;
      const fileList = {
        name: fileName,
        url: data.url,
        time: new Date().getTime()
      };
      if (typeof data === 'string') {
        fileList.url = data;
      } else {
        fileList.url = data.url;
      }
      this.attachment.push(fileList);
      this.$emit('complateSetData');
    },
    removeFileList({ file, index }) {
      this.attachment.splice(index, 1);
      this.$emit('removeFile');
      // this.$refs['dynamicLegalCreate'].validateField('contractInfo.attachment');
    },
    closeDialog() {
      this.attachment = [];
      this.id = '';
      this.isReview = true;
    },
    initInfo(data) {
      if (data) {
        this.attachment = data.attachment;
        this.id = data.id;
        this.isReview = data.isReview;
      }
    },
    submit() {
      if (!(this.attachment && this.attachment.length > 0)) {
        this.$message({
          type: 'warning',
          message: '请上传合同回收附件'
        });
        return;
      }
      if (this.loading) return;
      this.loading = true;
      const param = {
        id: this.id,
        attachment: this.attachment
      };
      contractRecycleApi(param).then(res => {
        this.loading = false;
        if (res.code === 200) {
          this.isEdit = false;
          this.$message({
            type: 'success',
            message: '提交成功'
          });
          this.$emit('success', this.id);
          this.handleClose();
        }
      }).catch((_) => {
        this.loading = false;
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.btn-container {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.lable{
  &::v-deep {
    .el-form-item__label{
      padding: 0 0 0 7px;
    }
  }
}
</style>
